<template>
    <div class="treeWrapper">
        <div class="tree-bar">
            <el-tree
            :data="treeData"
            :props="defaultProps"
            :highlight-current="true"
            :default-expanded-keys="[this.label]"
            node-key="label"
            ref="treeBox"
            class="elTree"
            @node-click="handleNodeClick"
            lazy
            :load="loadNode"
            ></el-tree>
        </div>
    </div>
</template>
<script>
import { getZryybmTree } from '@/api/dmgl/zryy.js';
export default {
    data() {
        return {
            treeData: [], // 分类树data
            defaultProps: {
                label: "label",
                children: "child",
                isLeaf: "leaf",
            },
            label: ''
        }
    },
    methods: {
        /**点击树节点 */
        handleNodeClick(data, node) {
            console.log(data)
            const that = this
            let tableObj = {
                flLike: data.data.fl
            }
            that.$emit("handleClickTreeNode", tableObj)
        },

        /** 树的一次性加载 */
        loadNode(node, resolve) {
            if (node.level === 0) { 
                this.getTdzryyTreeOne(resolve);
            } else if (node.level === 1) {
                this.getTdzryyTreeRoot(node, resolve)
            } else if (node.level > 1) {
                this.getTdzryyTree(node, resolve)
            }
        },

        /**获取一级节点数据 */
        getTdzryyTreeOne(resolve){
            let res = [
                {
                    id: "0",
                    label: "责任原因编码",
                    icon: null,
                    children: null,
                    data: {
                        bzm: null,
                        fl: "",
                        id: "",
                        pfl: null,
                        tdzrm: null,
                        tdzryy: "",
                        tjbzm: null,
                        zrqc: ""
                    }
                }
            ]
            this.label = res[0].label
            this.treeData = res;
            return resolve(res);
        },

        /**获取树 根节点数据*/
        async getTdzryyTreeRoot(node, resolve){
            let reqData = {
                root: "1",
                fl: node.data.id === "0"? "" : ""
            }
            let res = await getZryybmTree(reqData);
            if(res.code === 0){
                let req = res.data
                return resolve(res.data);
            }else{
                this.$message.error(res.message)
            }

        },
        /**获取树 下级节点数据 */
        async getTdzryyTree(node, resolve) {
            let reqData = {
                root: "0",
                fl: node.data.id
            }
            let res = await getZryybmTree(reqData);
            if(res.code === 0) {
                let req = res.data
                return resolve(res.data);
            }else{
                this.$message.error(res.message)
            }
        }
    }
}
</script>
<style lang='scss' scoped>
.tree-bar {
    margin-top: 7px;
}
label {
  font-weight: 400 !important;
}

.treeWrapper {
    height: 100%;
}
.treeWrapper .tree-bar {
    width: 100%;
    height: calc(100% - 7px);
    overflow: auto;
}
.elTree{
  width: 100%;
  height: 100%;
  overflow: auto;
}
/deep/ .el-tree > .el-tree-node {
  min-width: 100%;
  display: inline-block;
}
</style>
